import {View, Button, InputItem, Toast} from '@ant-design/react-native';
import {useState} from 'react';
import {StyleSheet} from 'react-native';
import axios from '../../http/http';
import useStorage from '../../hooks/storage';
import {TUserInfo} from '../../type/TUser';

const Realname = ({navigation}) => {
  const userInfoStorage = useStorage<TUserInfo>('userInfo');
  const [realname, setRealname] = useState('');
  const updateRealname = async () => {
    const userInfo = await userInfoStorage.getItem();
    if (!userInfo) {
      Toast.info({
        content: '请登录',
        duration: 1,
        mask: false,
      });
      return;
    }
    axios
      .post('/user/updateRealname', {
        id: userInfo.id,
        realname,
      })
      .then(res => {
        console.log(res);
        if (res.error === -1) {
          userInfoStorage.setItem({...userInfo, realname});
          Toast.info({
            content: '昵称更新成功',
            duration: 1,
            mask: false,
          });
          navigation.pop();
        }
      });
  };
  return (
    <View style={styles.realname_box}>
      <InputItem
        clear
        value={realname}
        onChange={(value: string) => {
          setRealname(value);
        }}
        labelNumber={3}
        placeholder="请输入昵称">
        新昵称
      </InputItem>
      <View>
        <Button
          type="primary"
          disabled={!realname}
          onPress={() => updateRealname()}
          style={{marginTop: 10}}>
          修改昵称
        </Button>
      </View>
    </View>
  );
};

const styles = StyleSheet.create({
  realname_box: {
    padding: 10,
  },
});
export default Realname;
